<template>
	<view>
		<!-- 顶部导航 -->
		<u-navbar :background="background">
			<view class="ft_16 fw-b">
				个人信息	
			</view>
		</u-navbar>
		<view class="content">
			<view class="con_1 card display just_space" @click="selectAvatar()">
				<view class="">头像</view>
				<view class="display">
					<image :src="userInfo.avatar"></image>
					<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
				</view>
			</view>
			<view class="con_2 card">
				<view class="display just_space nickname">
					<view class="">昵称</view>
					<view class="">
						<u-input type="text" v-model="userInfo.username" input-align="right"/>
					</view>
				</view>
				<view class="display just_space" style="padding: 15px 0;" @click="show=true">
					<view class="">生日</view>
					<view class="display">
						<text style="margin-right: 5px;">{{userInfo.birthday?userInfo.birthday:'请选择生日'}}</text>
						<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
					</view>
				</view>
			</view>
			<view class="con_1 card display just_space">
				<view class="">会员等级</view>
				<view class="display">
					<text>{{userInfo.level}}</text>
					<!-- <u-icon name="arrow-right" color="#999999" size="28"></u-icon> -->
				</view>
			</view>
			<!-- <view class="con_1 card display just_space">
				<view class="">用户id</view>
				<view class="display">
					<text>{{userInfo.user_id}}</text>
				</view>
			</view> -->
			
			<view class="submitBtn" @click="submit()">
				保存
			</view>
		</view>
		<!-- 生日弹窗 -->
		<u-picker v-model="show" mode="time" @confirm="confirmBirthday"></u-picker>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{backgroundColor: '#ffffff',}, //导航栏背景
				userInfo:{}, //个人信息
				
				show:false, //选择生日
				
			}
		},
		onLoad() {
			this.getuserInfo() //获取用户信息
			// console.log(this.$all.getData('user'));
		},
		methods: {
			getuserInfo(){ //获取用户信息
				this.$myRequest('user/index',{})
				.then(res=>{
					console.log(res.data.data);
					if(res.data.code==1){
						this.userInfo=res.data.data.info
					}
				})
			},
			selectAvatar(){ //选择头像
				uni.chooseImage({
					count: 1,
					success: chooseImageRes => {
						console.log(chooseImageRes.tempFilePaths[0])
						uni.showLoading()
						uni.uploadFile({
							url: getApp().globalData.domainName + 'common/upload',
							filePath: chooseImageRes.tempFilePaths[0],
							name: 'file',
							success: (res2) => {
								console.log(JSON.parse(res2.data))
								if(JSON.parse(res2.data)){
									uni.hideLoading()
									this.userInfo.avatar=JSON.parse(res2.data).data.fullurl
								}
							}
						})
					}
				});
			},
			confirmBirthday(e){ //确认生日
				console.log(e);
				this.userInfo.birthday=e.year+"-"+e.month+"-"+e.day
			},
			submit(){ //保存信息
				let dataInfo={
					username:this.userInfo.username,
					avatar:this.userInfo.avatar	,
					birthday:this.userInfo.birthday,	
				}
				console.log(dataInfo);
				this.$myRequest('user/profile',dataInfo)
				.then(res=>{
					console.log(res.data);
					this.$all.toast(res.data.msg)
					if(res.data.code==1){
						setTimeout(()=>{
							uni.$emit('userinfo')
							uni.navigateBack()
						},800)
					}
				})
			},
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: #fafafa;
}
.content{
	padding-top: 5px;
	.card{
		padding: 15px;
		margin-bottom: 5px;
		background-color: #ffffff;
	}
	.con_1{
		image{
			width: 40px;height: 40px;border-radius: 50%;margin-right: 5px;
		}
	}
	.con_2{
		padding: 0 15px;
		.nickname{
			padding: 10px 0;border-bottom: 1px solid #eeeeee;
		}
	}
	.submitBtn{
		padding: 12px 0;margin:50px 15px;color: #FFFFFF;border-radius: 30px;text-align: center;background: linear-gradient(90deg, #F1A421 0%, #E4741F 100%);
	}
	
	
}

</style>
